<template>
    <div>
        <a-form-model :label-col="{ span: 5 }" :wrapper-col="{ span: 12 }">
            <a-form-model-item label="4G网络接入点">
                <a-select v-model="form.apn">
                    <a-select-option value="CMNET">CMNET</a-select-option>
                    <a-select-option value="3GNET">3GNET</a-select-option>
                    <a-select-option value="CTLTE">CTLTE</a-select-option>
                    <a-select-option value="CMIOT">CMIOT</a-select-option>
                </a-select>
            </a-form-model-item>
            <a-form-model-item label="4G网络接入认证方式">
                <a-select v-model="form.authType">
                    <a-select-option value="NONE">NONE</a-select-option>
                    <a-select-option value="PAP">PAP</a-select-option>
                    <a-select-option value="CHAP">CHAP</a-select-option>
                </a-select>
            </a-form-model-item>
            <a-form-model-item label="认证用户名">
                <a-input v-model="form.username" />
            </a-form-model-item>
            <a-form-model-item label="认证密码">
                <a-input v-model="form.password" type="password" />
            </a-form-model-item>
        </a-form-model>
    </div>
</template>

<script>
export default {
    name: 'FourGNetwork',
    data() {
        return {
            form: {
                apn: 'CMNET',
                authType: 'NONE',
                username: '',
                password: ''
            }
        }
    },
    methods: {
        getConfig() {
            return { ...this.form }
        },
        setConfig(config) {
            this.form = { ...this.form, ...config }
        }
    }
}
</script>

<style scoped>
.ant-form-item {
    margin-bottom: 0;
}
</style> 